<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8"/>
    <title>编辑文章</title>
    <link rel="stylesheet" href="/layui/css/layui.css" />
    <script src="/js/jquery-2.1.1.min.js"></script>

    <script>
        //页面加载完毕执行
        $(function () {
            //获取本地存储的回显文章内容并赋值
            var item = localStorage.getItem("data");
            var parse = JSON.parse(item);
            $("#title").val(parse.title);
            $("#id").val(parse.id);
            var menu_id = parse.menuId;
            var status_id = parse.status;

            //回显单选按钮
            var radioObj = {0:"发布",1:"草稿"};
            var temp ='';
            for(var key in radioObj){
                if(key == status_id){
                    temp += '<input type="radio" name="status" value="'+ key +'" title="'+ radioObj[key] +'" checked='checked'/>';
                }
                else{
                    temp += '<input type="radio" name="status" value="'+ key +'" title="'+ radioObj[key] +'"/>';
                }
            }
            $("#status").html(temp);


            //回显下拉列表
            $.ajax({
                url: '/menu/getMenus',
                dataType: 'json',
                type: 'get',
                success: function (data) {
                    var tmp='<option value="">请选择文章所属菜单导航</option>';
                    for (var i in data){
                        if (data[i].cid == menu_id){
                            tmp +='<option value="'+data[i].cid+'" selected="selected">'+data[i].cname+'</option>';
                        }else{
                            tmp +='<option value="'+data[i].cid+'">'+data[i].cname+'</option>';
                        }
                    }
                    $("#menuId").html(tmp);
                    //回显数据,不加回显不了
                    layui.form.render();
                }
            });
        });
    </script>
</head>

<body>
<form id="articleForm" class="layui-form layui-form-pane" method="post" action="" style="margin-top: 20px;">
    <input id="id" type="hidden" name="id"/>
    <div class="layui-form-item">
        <label class="layui-form-label">文章名称</label>
        <div class="layui-input-inline">
            <input id="title" name="title" lay-verify="required" autocomplete="off" class="layui-input"
                   type="text" value=""/>
        </div>
    </div>


    <div class="layui-form-item">
        <label class="layui-form-label">所属菜单</label>
        <div class="layui-input-block">
            <select name="menuId" id="menuId" lay-filter="department">
                <option value=""></option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">发布内容</label>
        <div class="layui-input-block">
            <textarea name="content" id="content" lay-verify="content" class="field-content"></textarea>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">状态</label>
        <div class="layui-input-block" id="status">
<!--            <input type="radio" name="status" value="1" title="草稿"/>-->
<!--            <input type="radio" name="status" value="0" title="发布"/>-->
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block" style="margin-left: 10px;">
            <button class="layui-btn" lay-submit="" lay-filter="userSubmit">提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>

<script src="/js/article/articleList.js"></script>
<script type="text/javascript" src="/layui/layui.all.js" charset="utf-8"></script>

<!--富文本script-->
<script>
    layui.use(['layer','layedit', 'form','jquery'], function(){
        var form = layui.form,layer = layui.layer;
        var layer = layui.layer, $= layui.jquery,layedit=layui.layedit;
        var testEditor;
        //上传图片接口(layedit.set 一定要放在 build 前面，否则配置全局接口将无效。)
        layedit.set({
            uploadImage: {
                url: '/carousel/uploadImg' //接口url
                ,type: 'POST' //默认post
            }

        });
        //获取本地存储的回显文章内容
        //回显富文本内容 (赋值必须在建立textarea编辑器之前)
        var item = localStorage.getItem("data");
        var parse = JSON.parse(item);
        $("#content").html(parse.content)

        //建立textarea编辑器
        var index = layedit.build('content', {
            height: 450,
            width: 900,
            tool: [ 'strong' //加粗
                ,'italic' //斜体
                ,'underline' //下划线
                ,'del' //删除线
                ,'|' //分割线
                ,'left' //左对齐
                ,'center' //居中对齐
                ,'right' //右对齐
                ,'link' //超链接
                ,'unlink' //清除链接
                ,'face' //表情
                ,'image' //插入图片
                ,'help' //帮助
            ]
        });

        //用于同步编辑器内容到textarea（一般用于异步提交）
        form.verify({
            content: function(value) {
                return layedit.sync(index);
            }
        });

    });
</script>
</body>
</html>
